{% comment %}
	SWEN-261
	Thomas Heissenberger

	Activation page! Requires key!
{% endcomment %}
{% load staticfiles %}
{% load i18n %}

{% block content %}
	<link rel="stylesheet" type="text/css" href="/static/main.css">
	<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.4.2/pure-min.css"> <!-- css boilerplate -->
	<title>toolShare - Profile</title>
	<div id="top">
		
		<div class="menu">
			{% if user.is_authenticated %} 
				<b style="margin-left: 2em; margin-right: 2em">Welcome {{ user.username }}!</b>
				<!--- we include a menu here! -->
				<a class="pure-button" href="{{ SITE_URL }}/accounts/profile/">Profile</a>
				<a class="pure-button" href="{{ SITE_URL }}/accounts/logout/">Log Out</a>
				<a class="pure-button" href="{{ SITE_URL }}/tools/">Tools</a>
				<a class="pure-button" href="{{ SITE_URL }}/">Home</a>
				<a class="pure-button pure-button-primary" href="{{ SITE_URL }}/notices/">({{user.extendedprofile.stacksize}}) Notifications</a>

			{% else %} <a href="{{ SITE_URL }}/accounts/register/">Register</a> or <a href="{{ SITE_URL }}/accounts/login/">Sign-In</a>{% endif %}
		</div>

		<a href="\"><img src="{{ STATIC_URL }}logo.png" class="logo"></a>
	</div>

	<div class="center" style="text-align: center;"> <!-- start of main content -->
		<h1 style="text-align:center;">Settings</h1>
		<table class="pure-table" style="margin-left: auto; margin-right: auto">
			<thead>
				<tr>
					<th>Username</th>
					<th>First Name</th>
					<th>Last Name</th>
					<th>Email</th>
					<th>Zipcode</th>
				</tr>
			</thead>

			<tbody>
				<tr>
					<td>{{ user.username }}</td>
					<td>{{ user.first_name }}</td>
					<td>{{ user.last_name }}</td>
					<td>{{ user.email }}</td>
					<td style="color: darkred; font-style: bold;">{{ user.extendedprofile.zipcode }}</td>
				</tr>
			</tbody>
		</table>
		<br>
		<br>
		<br>
		<h1 style="text-align:center;">Your Inventory</h1>
		<div style="padding-bottom:5em;">
			<table class="pure-table" style="margin-left: auto; margin-right: auto; width: 60%; ">
				<thead>
					<tr>
						<th>Tool</th>
						<th>Quantity</th>
						<th></th>
					</tr>
				</thead>

				<tbody>
					{% for tool, quantity in inventory.items %}
						<tr>
							<td>{{ tool }}<a href="{{ SITE_URL }}/tools/view/{{tool|slugify}}"><img src="{{ STATIC_URL }}tool_pics/{{ tool|slugify}}.png" onerror="this.src='{{ STATIC_URL }}tool_pics/unknown.png';" style="height:128px; padding: 1em 1em 1em 1em;"></a></td>
							<td style="text-align: center;">{{quantity}}</td>
							<td style="text-align:center;"><a style="margin: 0 auto;"class="pure-button" href="{{ SITE_URL }}/tools/return/{{tool|slugify}}/">Return!</a></td>
						</tr>
					{% endfor %}
				<tbody>
			</table>
		</div>
	</div>

{% endblock %}